* {
	box-sizing: border-box;
	user-select: none;
}

body {
	background-color: #02101C;
}

.border {
	border: 1px solid #02D3FF;
}

.p-2 {
	padding: 0.12rem;
}

.h2 {
	width: 100%;
	font-size: 0.25rem;
	font-family: PingFang SC;
	font-weight: bold;
	color: #FFFEFE;
	padding: 0.05rem 0 0.05rem 0.05rem;
	user-select: none;
}

.h3 {
	width: 100%;
	font-size: 0.2rem;
	font-family: PingFang SC;
	font-weight: bold;
	color: #FFFEFE;
	padding: 0.05rem 0 0.05rem 0.05rem;
	user-select: none;
}

.box_content {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.container {
	width: 100vw;
	height: 100vh;
	padding: 0.1rem;
	display: flex;
	overflow: hidden;
}

.container .left_con {
	width: 5.2rem;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.left_con .left1 {
	width: 5.20rem;
	height: 22.23222%;
	display: flex;
	flex-direction: column;
}

.left_con .left1 .box_content {
	color: #C2BA9B;
	font-size: 0.225rem;
}

.left_con .left1 .box_content div {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-left: 0.125rem;
}

.left_con .left1 .box_content div p:last-child {
	margin-top: 0.05rem;
	text-align: center;
}

.left_con .left1 .box_content div p:last-child span {
	color: #02D3FF;
	font-size: 0.387625rem;
}

.left_con .left1 .box_content div:hover {
	cursor: pointer;
	background-color: rgba(255, 255, 255, .4);
	transition: all .1s ease-in;
}

.left_con .left2 {
	width: 5.20rem;
	height: 23.148148148148148%;
	display: flex;
	flex-direction: column;
}

.left_con .left2 .box_content {
	flex-direction: row;
}

.left_con .left2 .box_content>div {
	flex: 1;
}

 .left2_L {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

 .left2_L div {
	margin: 10px 0;
	color: #FFFEFE;
	font-size: 0.15rem;
}

 .left2_L div p:last-child {
	margin-top: 0.075rem;
	margin-left: 0.075rem;
}

.left2_L div p:last-child e {
	display: inline-block;
	width: 0.125rem;
	height: 0.125rem;
	background-color: #02D3FF;
	margin: 0 4px;
}
.left2_L div p:last-child span {
	color: #02D3FF;
	font-size: 0.175rem;
	margin: 0 0.05rem;
}

 .left2_R {
	display: flex;
	justify-content: center;
	align-items: center;
}

 .left2_R::before {
	content: '';
	display: flex;
	width: 1.2rem;
	height: 1.15rem;
	background: url(../icon/lou.png) no-repeat center center;
	background-size: 100% 100%;
}

.left_con .left3 {
	width: 5.20rem;
	height: 51.66667%;
	display: flex;
	flex-direction: column;
}

.left_con .left4 {
	width: 5.20rem;
	height: 27%;
	display: flex;
	flex-direction: column;
}

.left4 .box_content {
	padding: 0.25rem;
}

.left4 .box_content ul {
	display: flex;
	color: #46C8D6;
	font-size: 0.233333rem;
}

.left4 .box_content ul:hover {
	transition: all .1s ease-in;
	background-color: rgba(255, 255, 255, .4);
	cursor: pointer;
}

.left4 ul li {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
}

.left4 ul li.fault {
	color: #D93A2F
}

.container .right_con {
	flex: 1;
	padding-left: 0.1rem;
}

.right_con .right_conter {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.right_conter .right_top {
	width: 100%;
	flex: 1;
	display: flex;
	padding-bottom: 0.1rem;
}

.right_conter .right_top::before {
	content: '';
	display: block;
	flex: 1;
	height: 100%;
	background: url(../icon/bg_icoin.png) no-repeat center center;
	background-size: 125% 100%;
	box-shadow: 0 0 0.25rem rgb(255, 255, 255, .05);
	margin-right: 0.1rem;
}

.right_top .right_top_end {
	width: 4.76rem;
	height: 100%;
	float: right;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.right_top_end .end1 {
	width: 100%;
	height: 44.6%;
	display: flex;
	flex-direction: column;
}

.right_top_end .end1 .box_content>div {
	flex: 1;
	display: flex;
	flex-direction: row;
}

.right_top_end .end1 .box_content>div .T_R,
.T_L,
.B_L,
.B_C,
.B_R {
	flex: 1;
}

.right_top_end .end1 .box_content>div .B_L {
	display: flex;
	position: relative;
}

.right_top_end .end1 .box_content>div .B_L span {
	flex: 1;
}

.right_top_end .end1 .box_content>div .B_L ul {
	user-select: none;
	position: absolute;
	bottom: 0;
	left: 0;
	color: #fff;
	font-size: 0.125rem;
	text-align: center;
	width: 100%;
}

.right_top_end .end2 {
	width: 100%;
	height: 19.6951%;
	display: flex;
	flex-direction: column;
}

.right_top_end .end2 .box_content>div {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
}

.right_top_end .end2 .box_content .bilv {
	color: #57D7F3;
	font-size: 0.175rem;
}

.right_top_end .end2 .box_content .bilv::after {
	content: '';
	display: block;
	width: 0.3rem;
	height: 0.3rem;
	background: url(../icon/up.png) no-repeat center center;
}

.right_top_end .end2 .box_content .bilv e {
	cursor: pointer;
	display: block;
	padding: 0.075rem 0.075rem;
	background-color: #9CEAFB;
	color: #fff;
	margin-left: 0.1rem;
	border-radius: 0.0375rem;
	font-size: 0.2rem;
}

.right_top_end .end2 .box_content .bilv e:last-of-type {
	margin-right: 0.1rem;
}

.right_top_end .end2 .box_content .bilv span {
	font-size: 0.225rem;
	color: gold;
}

.right_top_end .end2 .box_content .con {
	display: flex;
	align-items: center;
}

.right_top_end .end2 .box_content .con .attract {
	width: 84%;
	height: 0.625rem;
	background: linear-gradient(90deg, #0A3C8E, #517DB8);
	display: flex;
	align-items: center;
	font-size: 0.175rem;
	color: #83B1FD;
	cursor: pointer;
}

.right_top_end .end2 .box_content .con .attract .item {
	flex: 1;
	display: flex;
	align-items: center;
	padding-left: 0.125rem;
}

.right_top_end .end2 .box_content .con .attract .item span:first-of-type {
	display: inline-block;
	width: 0.375rem;
	line-height: 1;
}

.right_top_end .end2 .box_content .con .attract .item span:last-of-type {
	font-size: 0.225rem;
	color: #fff;
	margin: 0 0.05rem;
}

.right_top_end .end3 {
	width: 100%;
	height: 18.91244%;
	display: flex;
	flex-direction: column;
}

.right_top_end .end3 ul {
	flex: 1;
	display: flex;
	color: #3EB7C4;
	font-size: 0.175rem;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}

.right_top_end .end3 ul li {
	margin-left: 0.25rem;
}

.right_top_end .end3 ul li:first-of-type {
	margin-left: 0;
}

.right_top_end .end3 ul li:last-of-type {
	margin-right: 0.25rem;
}

.right_conter .right_bottom {
	width: 100%;
	height: 37.59%;
	display: flex;
	justify-content: space-between;
}

.right_bottom .bottom_left {
	width: 4.675rem;
	height: 100%;
	display: flex;
	flex-direction: column;
}

.bottom_left .bl_top,
.bottom_left .bl_bottom {
	flex: 1;
	display: flex;
	flex-direction: column;
}

.right_bottom .bottom_center {
	flex: 1;
	height: 100%;
	padding-left: 0.1rem;
	display: flex;
	flex-direction: column;
}

.right_bottom .bottom_center .box_content>div {
	flex: 1;
	display: flex;
	flex-direction: column;
}

.bottom_center .box_content .bottom_c_T .box_content {
	flex-direction: row;
}

.bottom_center .box_content .bottom_c_T .box_content>div {
	display: flex;
}

.bottom_center .box_content .bottom_c_T .box_content .RB_CT_L {
	flex: 1.5;
	display: flex;
	flex-direction: row;
}

.RB_CT_L>div {
	flex: 1;
	font-size: 0.175rem;
	color: #fff;
	text-align: center;
}

.RB_CT_L>div:nth-child(1)::before {
	content: '';
	display: inline-block;
	width: 1.125rem;
	height: 1.125rem;
	background: url(../icon/left.png) no-repeat center center;
	background-size: 100% 100%;
}

.RB_CT_L>div:nth-child(2)::before {
	content: '';
	display: inline-block;
	width: 1.125rem;
	height: 1.125rem;
	background: url(../icon/center.png) no-repeat center center;
	background-size: 100% 100%;
}

.RB_CT_L>div:nth-child(3)::before {
	content: '';
	display: inline-block;
	width: 1.125rem;
	height: 1.125rem;
	background: url(../icon/right.png) no-repeat center center;
	background-size: 100% 100%;
}

.RB_CT_L>div p:first-of-type {
	font-size: 0.225rem;
	color: #02D3FF;
	margin-bottom: 0.075rem;
}

.RB_CT_L>div:nth-child(2) p:first-of-type {
	color: greenyellow;
}

.RB_CT_L>div:nth-child(3) p:first-of-type {
	color: yellow;
}

.bottom_center .box_content .bottom_c_T .box_content .RB_CT_R {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	align-items: center;
}

.bottom_center .box_content .bottom_c_T .box_content .RB_CT_R p {
	font-size: 0.175rem;
	width: 80%;
	color: #eee;
	display: flex;
	justify-content: space-around;
	align-items: center;
}

.bottom_center .box_content .bottom_c_T .box_content .RB_CT_R p span {
	font-size: 0.225rem;
	background: linear-gradient(90deg, rgba(81, 125, 184, .3), rgba(81, 125, 184, .6));
	padding: 0.025rem 0.025rem;
	border-radius: 0.05rem;
}

.bottom_center .box_content .bottom_c_B .box_content {
	padding: 0.1rem 0.5625rem;
	flex-direction: row;
	justify-content: space-between;
}

.bottom_center .box_content .bottom_c_B .box_content .tables {
	flex-direction: row;
	justify-content: space-between;
}

.bottom_center .box_content .bottom_c_B .box_content .tables ul {
	width: 48%;
	height: 100%;
	border-left: 1px solid #02D3FF;
	border-right: 1px solid #02D3FF;
}

.bottom_center .box_content .bottom_c_B .box_content .tables ul:first-child {
	border-left: 0;
}

.bottom_center .box_content .bottom_c_B .box_content .tables ul:last-child {
	border-right: 0;
}

.bottom_center .box_content .bottom_c_B .box_content .tables ul li {
	width: 100%;
	height: 25%;
	border-bottom: 1px solid #02D3FF;
	color: #fff;
	font-size: 0.15rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 0.225rem;
}

.bottom_center .box_content .bottom_c_B .box_content .tables ul li:first-of-type {
	color: #02D3FF;
}

.bottom_center .box_content .bottom_c_B .box_content .tables ul li:first-of-type span:last-of-type::before {
	display: none;
}

.bottom_center .box_content .bottom_c_B .box_content .tables ul li span {
	display: flex;
	align-items: center;
}

.bottom_center .box_content .bottom_c_B .box_content .tables ul li span:last-of-type::before {
	content: '';
	display: block;
	width: 0.075rem;
	height: 0.075rem;
	border-radius: 50%;
	background-color: #02D3FF;
	margin-right: 0.05rem;
}

.right_bottom .bottom_right {
	width: 5.15rem;
	height: 100%;
	display: flex;
	flex-direction: column;
	padding-left: 0.1rem;
}

.ul_th:hover {
	background-color: transparent !important;
}

.right_bottom .bottom_right .box_content {
	padding: 0.1rem 0.125rem;
}

.right_bottom .bottom_right .box_content ul {
	display: flex;
	color: #46C8D6;
	font-size: 0.175rem;
}

.right_bottom .bottom_right ul li {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
}

.right_bottom .bottom_right ul li.fault {
	color: #D93A2F;
}

.right_bottom .bottom_right .box_content .tables_con {
	flex: 1;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.right_bottom .bottom_right .box_content .tables_con .centers1,
.right_bottom .bottom_right .box_content .tables_con .centers2 {
	flex-direction: column;
	justify-content: space-between;
	height: 100%;
	flex: none;
}

.centers1 li,
.centers2 li {
	justify-content: space-between !important;
	display: flex;
}

.centers1 li:hover,
.centers2 li:hover {
	background-color: rgba(255, 255, 255, .4);
	cursor: pointer;
}

.centers1 li span,
.centers2 li span {
	flex: 1;
	text-align: center;
}

.centers1 li .fault,
.centers2 li .fault {
	color: #D93A2F;
}
